<style>
    .rbutton{
      color: primary;
      position : relative;
      float:none;
      width: 90%;
      left: 5%;
    }
    .rbutton2{
      float:right;
      border-radius: 12px;
      font-size: 70%;
      
    }
    li{
      float: left;
      list-style: none;
      width: 16px;
    }
    .editQuestion{
     font-family:"华文细黑";
     font-size: 1px;
     background-color: #efefef
    }

    .badge-style{
     border-radius: 15px;
     background-color: lightgrey;
   }    
    </style>
    
    <ion-header>
         <ion-navbar>
            <button menuToggle *ngIf="!selectedItem">
                <ion-icon name="menu"></ion-icon>
            </button>
            <ion-title>
              {{currentPoint}}
                <ion-icon name="basket" md="ios-basket-outline" style="margin-right:10%;float:right"></ion-icon> 
                <ion-icon name="heart-outline" *ngIf="currentCollect!=true" (click)="changeCollectStatus()" style="margin-right:15%;float:right"></ion-icon>
                <ion-icon name="heart" *ngIf="currentCollect ==true" (click)="changeCollectStatus()" style="margin-right:15%;float:right"></ion-icon>      

          
            </ion-title>
            </ion-navbar>
    </ion-header>
    <ion-content class="editQuestion">
        
        <!--<div style="overflow:scroll;overflow-y:hidden;overflow-x:hidden">-->

            <ion-slides class="ion-slides" *ngIf="mistakeListByPoints.length > 7" [slidesPerView]= "pageNumber" [pager]="false"> 
                <ion-slide class="ion-slide" *ngFor="let slide of  mistakeListByPoints; let i = index;">  
                     <div (click)="onClick(i)" style="position:absolute;">  
                      <ion-badge class="badge-style">
                     <span class="slide-title-unit" [ngClass]="{'slide-title-active': selectedIndex == i}">{{i+1}}</span>  
                      </ion-badge>
                     </div> 
                </ion-slide> 
            </ion-slides>
              
              <ion-slides class="ion-slides" *ngIf="!(mistakeListByPoints.length > 7)" [slidesPerView]= "mistakeListByPoints.length" [pager]="false"> 
                  <ion-slide class="ion-slide" *ngFor="let slide of  mistakeListByPoints; let i = index;">  
                       <div (click)="onClick(i)" style="position:absolute;">  
                        <ion-badge class="badge-style">
                       <span class="slide-title-unit" [ngClass]="{'slide-title-active': selectedIndex == i}"> {{i+1}}</span> 
                        </ion-badge> 
                       </div> 
                  </ion-slide> 
            
              </ion-slides>               
          <!--  
          <ion-slides  pager>
              
            <ion-slide  *ngFor="let mistake of mistakeListByPoints;let i = index">
            -->
           <!-- <ion-item><button ion-button padding-right (click)="changeStatus()">{{editStr}}</button></ion-item>-->
            <ion-item>
            <h4>科目:  语文 <label style="float:right;color:darkgray;">时间: {{currentMistake.editTime}}</label></h4>
          </ion-item>
         
          <ion-item>
            <h4>题目：</h4>
            <img src="{{currentMistake.quesPicUrl}}" class="img1"/>
        
            <h4>答案：</h4>
            <img src="{{currentMistake.answerPicUrl}}" class="img1"/>
          </ion-item>
    
        <ion-list>

            <ion-item>
                <h4>掌握程度</h4>
                   <li *ngFor="let item of starList;let i = index" item-right>
                   <img src="{{item}}" ng-disabled="editFlag" (click)="checkStar(i)" style="width:16px"/>
                   </li>
              </ion-item>

           <ion-item>
             <ion-label><h3>来源: {{currentMistake.source}}</h3></ion-label>
             <!--<ion-input type="text" [(ngModel)] = "source" color="primary" *ngIf="editFlag==true"></ion-input>
             <ion-label><h5>{{source}} {{mistake.source}}</h5></ion-label>
             -->
           </ion-item>
    
           <ion-item (click)="presentModal()">
              <h4>知识点
              <button ion-button outline class="rbutton2">{{currentMistake.points}}</button>
              <button ion-button outline class="rbutton2" *ngFor="let item of pointsSelected">{{item}}</button>
              </h4>
            </ion-item>
    
           <ion-item (click)="doMultiChoice()">
             <h4>错误原因  
              <button ion-button outline class="rbutton2">{{currentMistake.reason}}</button>
              <button ion-button outline class="rbutton2" *ngFor="let item of testCheckboxResult">{{item}}</button>
             </h4>
            </ion-item>
      
           <ion-item>
             <h4>权威讲解 >> </h4>
           </ion-item>
           <ion-item (click)="gotoSameExample()">
             <h4>相似题目>></h4>
            </ion-item>
        </ion-list>
    
       <!-- <div class="rbutton"><button ion-button padding-top block (click)="submitMistakes()">submit</button></div>-->
        
        <!--<div class="rbutton"><button ion-button padding-top block (click)="gotoShowPage()">确定</button></div>-->
        <!--</ion-slide>
        </ion-slides>
        </div>-->
    </ion-content>
          